<section>
  <div class="page-header">
    <h1>Settings</h1>
  </div>
  <div class="row">
    <nav class="col-sm-3 col-md-3">
      <ul class="nav nav-pills nav-stacked">
        <li ui-sref-active="active">
          <a ui-sref="settings.profile">Edit Profile</a>
        </li>
        <li ui-sref-active="active">
          <a ui-sref="settings.picture">Change Profile Picture</a>
        </li>
        <li ui-sref-active="active" ng-show="vm.user.provider === 'local'">
          <a ui-sref="settings.password">Change Password</a>
        </li>
        <li ui-sref-active="active">
          <a ui-sref="settings.accounts">Manage Social Accounts</a>
        </li>
      </ul>
    </nav>
    <div class="col-sm-9 col-md-8 settings-view">
      <div ui-view></div>
    </div>
  </div>
</section>
